<?php
$me = $_GET['classic'];
$password = $_GET['password'];
?>
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>寻找摩拜</title>
    <style type="text/css">
        html {
            height: 100%
        }

        body {
            height: 100%;
            margin: 0px;
            padding: 0px
        }

        #container {
            height: 100%
        }
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=UT4llqvTpzbApvoSZi39vGy0qewa9eaU">
        //v2.0版本的引用方式：src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"
        //v1.4版本及以前版本的引用方式：src="http://api.map.baidu.com/api?v=1.4&key=您的密钥&callback=initialize"
    </script>
</head>

<body>
<div id="container"></div>
<script type="text/javascript">
    function bike(id, lat, lon) {
        this.id = id;
        this.lat = lat;
        this.lon = lon;
    }
    var bikes = [];
    var markers = [];
    var map = new BMap.Map("container");
    var point = new BMap.Point(121.4102210000, 31.2356090000);
    map.centerAndZoom(point, 19);
    var geolocation = new BMap.Geolocation();
    geolocation.getCurrentPosition(function (r) {
        if (this.getStatus() == BMAP_STATUS_SUCCESS) {
            var mk = new BMap.Marker(r.point);
            map.addOverlay(mk);
            map.panTo(r.point);
        }
    }, {enableHighAccuracy: true});
    map.addControl(new BMap.NavigationControl());
    map.addControl(new BMap.ScaleControl());
    var icon = new BMap.Icon('mobike_old.png', new BMap.Size(40, 40), {
        anchor: new BMap.Size(20, 38)
    });
    var centerIcon = new BMap.Icon('assist_ic.png', new BMap.Size(93, 93), {
        anchor: new BMap.Size(46, 90)
    });
    function ZoomControl() {
        // 设置默认停靠位置和偏移量
        this.defaultAnchor = BMAP_ANCHOR_BOTTOM_LEFT;
        this.defaultOffset = new BMap.Size(10, 60);
    }
    // 通过JavaScript的prototype属性继承于BMap.Control
    ZoomControl.prototype = new BMap.Control();
    // 自定义控件必须实现initialize方法，并且将控件的DOM元素返回
    // 在本方法中创建个div元素作为控件的容器，并将其添加到地图容器中
    ZoomControl.prototype.initialize = function (map) {
// 创建一个DOM元素
        var div = document.createElement("div");
        var img = document.createElement("img");
        img.src = 'refresh.png';
        div.appendChild(img);
        div.style.cursor = "pointer";
        div.onclick = function (e) {
            var xmlhttp = new XMLHttpRequest();
            xmlhttp.open("GET", "getMobikeData.php?lat=" + centerPoint.lat + "&lon=" + centerPoint.lng + "&password=<?php echo $password?>", true);
//            alert("getMobikeData.php?lat=" + centerPoint.lat+ "&lon=" + centerPoint.lng);
            xmlhttp.onreadystatechange = function () {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
//                    alert(xmlhttp.responseText);
                    var jsonObj = JSON.parse(xmlhttp.responseText);
                    if (jsonObj.code == 0) {
                        <?php if ($me == 1) {
                            echo "var pattern1 = new RegExp('02101.*');";
                    } else {
                            echo "var pattern1 = new RegExp('021.*');";
                    }?>

                        var pattern2 = new RegExp('02102.*');
                        for (var i = 0; i < jsonObj.object.length; i++) {
                            if (pattern1.test(jsonObj.object[i].bikeIds) ||
                                pattern2.test(jsonObj.object[i].bikeIds)) {
//                                alert(jsonObj.object[i].distX + ", " + jsonObj.object[i].distY);
                                var lng = jsonObj.object[i].distX;
                                var lat = jsonObj.object[i].distY;
                                bikes.push(new bike(jsonObj.object[i].bikeIds, lat, lng));
                                translate(new BMap.Point(lng, lat));

                            }
                        }
                    }
                }
            };
            xmlhttp.send();
        };
        // 添加DOM元素到地图中
        map.getContainer().appendChild(div);
        // 将DOM元素返回
        return div;
    };
    var myZoomCtrl = new ZoomControl();
    map.addControl(myZoomCtrl);
    var centerPoint = map.getCenter();
    var centerMarker = new BMap.Marker(centerPoint, {
        icon: centerIcon
    });
    map.addEventListener("dragging", function () {
        map.removeOverlay(centerMarker);
        centerPoint = map.getCenter();
        centerMarker = new BMap.Marker(centerPoint, {
            icon: centerIcon
        });
        map.addOverlay(centerMarker);
    });
    map.addOverlay(centerMarker);

    map.enableScrollWheelZoom();

    function addMarker(lng, lat) {
        var point = new BMap.Point(lng, lat);
        var markerBike = new BMap.Marker(point, {
            icon: icon
        });
        var opts = {
            width: 150,     // 信息窗口宽度
            height: 80,     // 信息窗口高度
            title: "车号"  // 信息窗口标题
        };
        markerBike.addEventListener("click", function () {
            var infoWindow = new BMap.InfoWindow(findPlate(markerBike), opts);  // 创建信息窗口对象
            map.openInfoWindow(infoWindow, point);//打开信息窗口
        });
        markers.push(markerBike);
        map.addOverlay(markerBike);
    }

    translateCallback = function (data) {
        if (data.status === 0) {
            addMarker(data.points[0].lng, data.points[0].lat);
        }
    };

    function findPlate(marker) {
        for (var i = 0; i < markers.length; i++) {
            if (markers[i] === marker) {
                var id = bikes[i].id;
                id = id.substring(0, id.length - 1);
                return id;
            }
        }

        return "未知车牌";
    }

    function translate(ggPoint) {
//       alert('1');
        var convertor = new BMap.Convertor();
        var pointArr = [];
        pointArr.push(ggPoint);
        convertor.translate(pointArr, 3, 5, translateCallback)
    }

    //    }
    //
    //    addMarker(point, 0);


</script>
</body>
</html>